<template>
  <div class="container">
      <classTit title="机构课程"></classTit>
      <ul>
        <li v-for="(item,idx) in courseList" :key="idx" >
            <courseList :kcList="item"  :type="2" v-if="item.article_type==6"></courseList>
            <courseList :kcList="item"  :type="1" v-if="item.article_type==5"></courseList>
        </li>
      </ul>
      
      <img :src="img+'/que/no_conten@2x.png'" class="queS" v-if="queS"/>
  </div>
</template>

<script>
import courseList from "@/components/list";
import classTit from "@/components/classTit"
import {startClassList}  from "@/api/star"
export default {
  components: {
      courseList,
      classTit 
  },

  data () {
    return {
       id:"",
       page:1,
       courseList:[],
       img: this.$URL.imgurl,
       queS:false
    }
  },
  methods:{
     getList(){
       this.queS=false;
       startClassList({id:this.id,page:this.page}).then(res=>{
           if(res.code==200){
                let last_page=res.data.data.last_page;
                if(this.page==1){
                    this.courseList=res.data.data.data
                }else{
                    this.courseList=this.courseList.concat(res.data.data.data)
                }
                if(last_page>this.page){
                  this.load=true
                }else{
                  this.load=false
                }
           }else if(res.code==201){
               this.queS=true
           }
       }).catch(res=>{
           this.queS=true
       })
     }
  },
  created () {
    
  },
  onLoad(options){
    Object.assign(this.$data, this.$options.data())
     this.id=options.id;
     this.getList()
  },
  onReachBottom(){
    if(this.load){
       this.page++
       this.getList()
    }
  },
  onUnload(){
     
  },
}
</script>
<style lang="scss">
 .footer{
    position:fixed;
    left:0;
    right:0;
    bottom:0;
    .toBuy{
        background-color:#1A84FB;
        color: #fff;
    }
  }
</style>
<style scoped lang="scss">
    .line{
        width:375px;
        height:5px;
        background:rgba(244,245,245,1);
    }
    .queS{
      width:417rpx;
      height:324rpx;
      display:block;
      margin:50px auto;
    }
    li{
      position: relative;
      &::after{
        position: absolute;
        left:15px;
        right:15px;
        bottom:0;
        border-bottom:1px solid #ddd;
        content:""
      }
    }
</style>
